@inject('order','App\Models\Order')
@inject('service','App\Models\Service')
@include('layouts.tips.error')
<div class="bom_nav">
    <div class="g_cw">
        <div class="left">
            <ul class="list">
                <form method="POST" action="{{route('order.store',$order)}}">
                    @csrf
                    <li class=" li1 ">
                        <select name="service_id" id="attr_1">
                            @foreach($service->all() as $s)
                                <option value="{{$s->id}}">{{$s->name}}
                                </option>
                            @endforeach
                        </select>
                    </li>
                    <li class="li2">
                        <input type="text" value="{{$order['name']}}" name="name" id="attr_2" placeholder="姓名"
                        >
                    </li>
                    <li class="li3">
                        <input type="text" value="{{$order['mobile']}}" name="mobile" id="attr_3" placeholder="手机号码">
                    </li>
                    <li class="li4">
                        <input type="text" value="{{$order['address']}}" name="address" id="attr_4" placeholder="地址">
                    </li>
                    <button type="submit" id="submit"
                            style="margin:0 0 0 10px;
                            padding:10px 20px;
                            width:111px;
                        height:50px;
                        font-weight: bold;
                        color:white;
                        border: none;
                        cursor: pointer;
                        vertical-align:middle;
                        background:#ff7f00;"
                    >我要预约
                    </button>
                </form>

            </ul>
        </div>
    </div>
</div>
<script>
    var attr_1 = document.querySelector('#attr_1');
    var attr_2 = document.querySelector('#attr_2');
    var attr_3 = document.querySelector('#attr_3');
    var attr_4 = document.querySelector('#attr_4');
    var btn = document.querySelector('#submit');
    btn.addEventListener('click', function () {
        if (attr_1.value && attr_2.value && attr_3.value && attr_4.value) {
            // alert('请填写必要信息')
        } else {
            alert('请填写必要信息')
        }
    })

</script>
